<template>
	<view class="relative">
		<view>
			<view class="bg-white" style="padding: 30rpx 20rpx; margin-bottom: 40rpx">
				<view class="Media Media--center" style="margin-bottom: 30rpx;">
					<u-image src="https://fb-cloud.oss-cn-shenzhen.aliyuncs.com/app/11.png" width="38rpx" height="38rpx" mode="aspectFill"
						style="margin: 0 auto;"></u-image>
					<view class="Media-body text-lg" style="font-weight: bold; padding: 0 20rpx;">平台数据</view>
				</view>
				<view v-if="info.analysis && info.analysis.spf" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of4 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">胜平负</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.cp.arr1 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.ss.arr1 || '/'}}</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.cp.arr2 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.ss.arr2 || '/'}}</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.cp.arr3 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.ss && info.analysis.spf.ss.arr3 || '/'}}</view>
					</view>
				</view>
				<view class="Grid Grid--center Grid--justifySpaceBetween Grid--1of4 text-center text-sm">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">大小球</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds_cp.arr1 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds.arr1 || '/'}}</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds_cp.arr2 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds.arr2 || '/'}}</view>
					</view>
					<view v-if="info.match_info" class="Grid-cell" style="padding: 0 4rpx;">
						<view v-if="[0, 1].includes(info.match_info.status_id)" style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds_cp.arr3 || '/'}}</view>
						<view v-else style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.odds && info.odds.arr3 || '/'}}</view>
					</view>
				</view>
			</view>
			<view class="bg-white" style="padding: 30rpx 20rpx; margin-bottom: 40rpx">
				<view class="Media Media--center" style="margin-bottom: 30rpx;">
					<u-image src="https://fb-cloud.oss-cn-shenzhen.aliyuncs.com/app/11.png" width="38rpx" height="38rpx" mode="aspectFill"
						style="margin: 0 auto;"></u-image>
					<view class="Media-body text-lg" style="font-weight: bold; padding: 0 20rpx;">队伍状态</view>
				</view>
				<view class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">类别</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">主队</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">客队</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.teamStatus" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">近期状态</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.home_team && info.analysis.teamStatus.home_team.name || '--'}}</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.away_team && info.analysis.teamStatus.away_team.name || '--'}}</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.teamStatus" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">近期状态得分</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.home_team && info.analysis.teamStatus.home_team.df || '--'}}分</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.away_team && info.analysis.teamStatus.away_team.df || '--'}}分</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.lcyt" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">临场状态</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx; flex: 0 0 66.6666%;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.lcyt.dxq_str || '--'}}</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.teamStatus" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">场均进球数</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.home_team && info.analysis.teamStatus.home_team.jq_num || '--'}}</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.away_team && info.analysis.teamStatus.away_team.jq_num || '--'}}</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.teamStatus" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">场均失球数</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.home_team && info.analysis.teamStatus.home_team.sq_num || '--'}}</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.away_team && info.analysis.teamStatus.away_team.sq_num || '--'}}</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.teamStatus" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">得失比</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx; flex: 0 0 66.6666%;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.teamStatus.gain_loss || '--'}}</view>
					</view>
				</view>
			</view>
			<view class="bg-white" style="padding: 30rpx 20rpx; margin-bottom: 30rpx">
				<view class="Media Media--center" style="margin-bottom: 30rpx;">
					<u-image src="https://fb-cloud.oss-cn-shenzhen.aliyuncs.com/app/11.png" width="38rpx" height="38rpx" mode="aspectFill"
						style="margin: 0 auto;"></u-image>
					<view class="Media-body text-lg" style="font-weight: bold; padding: 0 20rpx;">历史同赔</view>
				</view>
				<view class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">胜</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">平</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">负</view>
					</view>
				</view>
				<view v-if="info.analysis && info.analysis.spf" class="Grid Grid--center Grid--justifySpaceBetween Grid--1of3 text-center text-sm"
					style="margin-bottom: 8rpx;">
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.lstp && info.analysis.spf.lstp.s || '/'}}</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.lstp && info.analysis.spf.lstp.p || '/'}}</view>
					</view>
					<view class="Grid-cell" style="padding: 0 4rpx;">
						<view style="background-color: #F2F9F6; padding: 20rpx 10rpx">{{info.analysis.spf.lstp && info.analysis.spf.lstp.f || '/'}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'Info',
		props: {
			item: {
				type: Object,
				default: () => {}
			},
			info: {
				type: Object,
				default: () => {}
			}
		},
		methods: {
			handleClick(url) {
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	
</style>